<%@ page pageEncoding="UTF-8"%>
<%@ include file="/common/validate.jsp"%>
<%@ include file="function.jsp"%>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>通知详情</title>
    <link rel="stylesheet" href="/css/public.css?cache=<%=Math.random()%>">
    <link  href="../../hos_manage/images/favicon.ico?cache=<%=Math.random()%>" rel="shortcut icon" type="image/x-icon">
    <link rel="stylesheet" type="text/css" href="../../css/palace/message/message_detail.css?a=<%=Math.random()%>">
    <script src="/js/jquery-1.9.1.min.js"></script>
    <script src="/js/components/encode.js"></script>
</head>
<body id="app">
<%@ include file="../../header.jsp"%>
<!--内容-->
<div class="containerone">
    <%@ include file="../../left_menu.jsp"%>
    <!--右边内容-->
    <div class="right_cont">
        <!--右边导航下面内容-->
        <div class="message-detail">
            <div class="title">
                <div class="address-left show-block note">
                    <span @click="homePage()" class="hover">首页</span>
                    <span class="left-distance">></span>
                    <span class="left-distance hover" @click="back()">通知列表</span>
                    <span class="left-distance">></span>
                    <span class="left-distance">通知详情</span>
                </div>
            </div>
            <div class="container">
                <div class="position">
                    <div class="show-block address-book-right">
                        <div>
                            <div class="show-block content-title" v-html="detailList.title"></div>
                            <div class="level show-block" v-html="detailList.level_name"></div>
                        </div>
                        <div class="read">
                            <span class="light-grey">阅读情况:</span>
                            <span class="light-grey">已读</span>
                            <span class="light-grey" v-html="detailList.has_read"></span>
                            <span class="light-grey">人</span>
                            <span class="light-red" style="margin-left: 10px">未读</span>
                            <span class="light-red" v-html="detailList.no_read"></span>
                            <span class="light-red">人</span>
                        </div>
                        <div class="send">
                            <span class="light-blue">发件人:</span>
                            <span class="light-blue" v-html="detailList.author"></span>
                            <span class="light-grey" style="margin-left: 15px">时间:</span>
                            <span class="light-grey" v-html="detailList.date"></span>
                        </div>
                        <div class="distance">
                            <div class="content" v-html="content"></div>
                            <div class="receive-person">
                                <div class="receive-person-left show-block">
                                    <span class="light-grey">收件人:</span>
                                    <span class="light-blue" v-html="displayReceivePerson(receivePerson, index)"></span>
                                </div>
                                <div class="receive-person-right show-block" v-show="showMoreReceive(receivePerson, index)" @click="showMore(this)">更多>></div>
                            </div>
                            <div class="commit">
                                <div class="show-block commit-left">回复情况</div>
                                <div class="show-block commit-right">
                                    <img src="../../images/palace/message/ic-mes.png">
                                    <div class="show-block" v-html="commentPerson.size"></div>
                                </div>
                            </div>
                            <div class="each-commit" v-for="i in commentPerson.list">
                                <div class="commit-top">
                                    <img src="../../images/palace/message/avator-male.png">
                                    <div class="name show-block" v-html="i.comment_name"></div>
                                    <div class="zw show-block light-grey" v-html="i.dept_name"></div>
                                    <div class="hour show-block light-grey" v-html="i.time"></div>
                                </div>
                                <div class="commit-foot" v-html="i.content"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    new Vue({
        el: "#app",
        data: {
            id: "",
            detailList: {},
            content: "",
            receivePerson: "",
            commentPerson: [],
            index: 0,
        },
        methods: {
            back: function() {
                locationHerf("message_center");
            },
            showMoreReceive: function(obj, index) {
                if (obj.length > 8 && index == 0) {
                    return true;
                } else {
                    return false;
                }
            },
            displayReceivePerson: function(obj, index) {
                if (obj.length > 8 && index == 0) {
                    return obj.slice(0, 8) + "...";
                } else {
                    return obj;
                }
            },
            showMore: function(obj) {
                this.index = 1;
            },
            homePage: function () {
                location.href = "../../index.jsp";
            }
        },
        ready: function () {
            var self = this;
            self.id = getHrefParms("message_detail");
            $.ajax({
                type: "post",
                url: location.href,
                data: {
                    act: "messageDetail",
                    hospital: "${user.hospital}",
                    id: self.id,
                },
                success: function (res) {
                    res = JSON.parse(res);
                    if (res.errcode == 0) {
                        self.detailList = res.data;
                        self.content = new Base64().decode(res.data.content);
                        var receiver = JSON.parse(res.data.receiver);
                        var _this = "";
                        for (var i = 0; i < receiver.user.length; i++) {
                            _this += receiver.user[i].name + "、"
                        }
                        for (var j = 0; j < receiver.label.length; j++) {
                            _this += receiver.label[j].name + "、"
                        }
                        for (var k = 0; k < receiver.dept.length; k++) {
                            _this += receiver.dept[k].name + "、"
                        }
                        self.receivePerson = _this;
                        $.ajax({
                            type: "post",
                            url: location.href,
                            data: {
                                act: "commentList",
                                hospital: "${user.hospital}",
                                id: self.id,
                            },
                            success: function (res) {
                                res = JSON.parse(res);
                                self.commentPerson = res.data;
                            }
                        });
                    }
                }
            });
        },
    });
</script>
</html>
